@use "styles/Radius.module.scss";
@use "styles/Spacings.module.scss";
@use "styles/Typography.module.scss";

.tag_wrapper {
  padding: Spacings.$spacing01;
  padding-inline: Spacings.$spacing03;
  border-radius: Radius.$big;
  width: fit-content;
  font-size: Typography.$tiny;
  font-weight: 600;

  &.primary {
    color: var(--primary-0);
    background-color: var(--background-primary-0);
  }

  &.gold {
    background-color: var(--gold);
  }

  &.dangerous {
    color: var(--dangerous-dark);
    background-color: var(--background-error);
  }

  &.success {
    color: var(--success);
    background-color: var(--background-success);
  }
}
